<template>
	<view class="">
		<view v-if="time !== null" class="flex align-center justify-center font-sm text-dark">
			{{ time }}
		</view>
		<view class="flex align-start justify-start mt-2" :style="isMe ? 'flex-direction: row-reverse' : ''">
			<image :src="item.userPic" style="width: 100rpx; height: 100rpx" class="rounded-circle" mode="aspectFill"></image>
			<view class="flex flex-column align-center justify-start">
				<view class="font-small text-light-muted">
					{{ item.nikename }}
				</view>
				<view class="px-2 mt-3 bg-light mx-2" style="max-width: 400rpx; word-wrap: break-word">{{ item.data }}</view>
			</view>
		</view>
		<!-- <view class="flex align-start justify-start" style="flex-direction: row-reverse">
			<image src="../../static/image/2021051521244130.jpg" style="width: 100rpx; height: 100rpx" class="rounded-circle" mode="aspectFill"></image>
			<view class="flex px-2 mt-3 bg-light" style="max-width: 400rpx;">
				你好
			</view>
		</view> -->
	</view>
</template>

<script>
import $T from '@/common/time.js';
export default {
	props: {
		item: {
			type: Object,
			default: () => {}
		},
		index: Number,
		startTime: [Number, String]
	},
	methods: {},
	computed: {
		// 判断是否是当前用户
		isMe() {
			const userInfo = uni.getStorageSync('userInfo');
			return this.item.userId === userInfo.id;
		},
		time() {
			return $T.getChatTime(this.item.create_time, this.startTime);
		}
	}
};
</script>

<style></style>
